﻿<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">

    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" href="../css/e_list.css">
    <link rel="stylesheet" href="../css/dislog.css" />

    <style type="text/css">
        .aui-dialog-header {
            font-size: 0.8rem;
        }
        
        #code canvas {
            margin: 0 auto;
        }
        
        .bottom {
            text-align: center;
            font-size: 0.8rem;
            color: #ddd;
        }
    </style>
    <title>E卡列表</title>
</head>

<body>
    <header class="aui-bar aui-bar-nav aui-bar-light" style="background: #4e536c;position: fixed;">
        <a class="aui-pull-left aui-btn" onclick="history.go(-1)" style="color: #333;">
            <span class="aui-iconfont aui-icon-left" style="color: #FFFFFF;"></span>
        </a>
        <div class="aui-title" style="color: #FFFFFF;">筛选列表</div>

    </header>
    <div class="items" style="margin-top: 2.2rem;">

    </div>
    <div class="bottom ">---------我们是有底线的---------</div>
    <template id="list">
			{{each data_list as value}}
			<div class="aui-list aui-media-list">
				<ul class="list">
					<li class="aui-list-item">
						<div class="aui-media-list-item-inner">
							{{if value.ecard_state =='10'}}
							<div class="aui-list-item-inner">
								<div class="aui-list-item-title">E卡卡号：<span class="card">{{value.ecard_no}}</span></div>
								<div class="aui-list-item-title m12">
									<span>状态：</span>
									<span class="active-no">未激活</span>
								</div>

							</div>
							<div class="aui-list-item-media">
								<a href="javascript:;" class="pick-no" tapmode onclick="openDialog('callback',{{value.ecard_no}},{{value.ecard_sn}},{{value.type_ecard_money}})">发卡</a>
							</div>
							{{else if value.ecard_state=='20'}}
							<div class="aui-list-item-inner">
								<div class="aui-list-item-title">E卡卡号：<span class="card">{{value.ecard_no}}</span> </div>
								<div class="aui-list-item-title m12">
									<span>用户名：</span>
									<span class="active-no">{{value.ecard_mobile}}</span>
								</div>
							</div>
							<div class="aui-list-item-media">
								<a href="javascript:;" class="pick-ok">已发卡</a>
							</div>
							{{else if value.ecard_state =='40'}}
							<div class="aui-list-item-inner">
								<div class="aui-list-item-title">E卡卡号：<span class="card">{{value.ecard_no}}</span></div>
								<div class="aui-list-item-title m12">
									<span>用户名：</span>
									<span class="active-no">{{value.ecard_mobile}}</span>
								</div>
							</div>
							<div class="aui-list-item-media">
								<a href="javascript:;" class="pick-pass">已过期</a>
							</div>
							{{/if}}
						</div>
					</li>
				</ul>
			</div>
			{{/each}}
		</template>

    <script src="../js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="../js/aui-toast.js" charset="utf-8"></script>
    <script src="../js/comment.js"></script>
    <script src="../js/aui-dialog.js"></script>
    <script src="../js/e_list.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/jquery.qrcode.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/template.js" type="text/javascript" charset="utf-8"></script>

    <script type="text/javascript">
        var datas = JSON.parse(window.localStorage.getItem("datas"));
        var state = datas.state;

        if (datas.data_list.length == 0) {
            window.location.href = 'empty.html';
        }
        //获取ttId
        var query = window.location.search; //获取URL地址中？后的所有字符  
        var str = decodeURI(query);
        var obj;
        if (str[0] === '?') {
            var newstr = str.substr(1);
            obj = JSON.parse(newstr);
        }

        var html = template("list", datas);
        $(".items").append(html);

        var curpage = 1;
        var data = {
            ttId: obj,
            state: state,
            curpage: curpage,
            page: 10,
            day: 0,
        }
        var toast = new auiToast({});

        function load(data, curpage) {
            var pages = data.curpage;
            $.ajax({
                type: "get",
                url: url + "station/stationsublist",
                data: data,
                success: function(result) {
                    console.log(result)
                    if (result.code == 200) {
                        if (pages > result.datas.StationSubList.datas.showpage) {
                            toast.hide();
                            $('.bottom').show();
                            return;
                        } else {
                            $('.bottom').hide();
                            toast.hide();
                            var data = result.datas.StationSubList.datas;
                            var html = template("list", data);
                            $(".items").append(html);
                        }


                    } else {
                        showDefault('loading');
                        setTimeout(function() {
                            window.location.href = 'empty.html'
                        }, 5000)
                    }
                },
                error: function(err) {
                    toast.hide()
                }
            });
        }

        function showDefault(type) {
            switch (type) {
                case "loading":
                    toast.loading({
                        title: "加载中",
                        duration: 2000
                    }, function(ret) {

                    });
                    break;

            }
        }

        $(window).scroll(function() {
            var doc_height = $(document).height();
            var scroll_top = $(document).scrollTop();
            var window_height = $(window).height();
            if (scroll_top == 0) {

            } else if (scroll_top + window_height >= doc_height) {
                showDefault('loading');
                data.curpage++;
                load(data, curpage);
            }
        });
    </script>
</body>

</html>